﻿@{
    Layout = "_Layout";
    ViewData["Title"] = "项目管理";
}
<el-table-list ref="ElTableList" :button-size="buttonSize" v-loading.fullscreen.lock="fullscreenLoading"
               :dialog-visible="dialogVisible"
               :footer-visible="footerVisible"
               :filter-json="filterJson"
               :table-data="tableData" :show-refresh='true' :show-search="true"
               :primary-key="primaryKey"
               :columns="columns"
               :total-rows="totalRows"
               :prev-text="prevText"
               :next-text="nextText"
               :dialog-width="dialogWidth"
               :form-json="formJson"
               :load-data="handleLoadData"
               :delete="handleDelete"
               :is-delete="true"
               :is-edit="true"
               :submit="submitForm"
               :detail="viewDetailDialog"
               @* link-text="项目计划" :handle-link="handleDictValue" *@>
    <template slot="columns">
        <el-table-column prop="code" label="代码" max-width="260" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="name" label="名称" max-width="220" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="isDefault" label="是否默认" width="80" align="center">
            <template slot-scope="scope">
                <el-tag size="mini" v-if="scope.row.isDefault==1">默认</el-tag>
                <el-tag size="mini" type="info" v-else>未默认</el-tag>
            </template>
        </el-table-column>
        <el-table-column prop="sort" label="排序" min-width="80"></el-table-column>
        <el-table-column prop="isDisable" label="状态" width="80" align="center">
            <template slot-scope="scope">
                <el-tag size="mini" v-if="scope.row.isDisable==0">启用</el-tag>
                <el-tag size="mini" type="danger" v-else>禁用</el-tag>
            </template>
        </el-table-column>

        <el-table-column label="修改记录" width="100" align="center" show-overflow-tooltip>
            <template slot-scope="scope"><modify-record :data="scope.row" /></template>
        </el-table-column>
    </template>

</el-table-list>
<el-open-web dialogtitle="项目计划" ref="iframe" v-bind:dialogvisible="dictValueDialogVisible" dialogwidth="100%" :url="dictValueUrl" v-on:close="onClose"
             dialogstyle="width:100%;height:580px;"></el-open-web>

@section Scripts {
    <script>

        new Vue({
            el: "#main",
            data() {
                return {
                    totalRows: 0,
                    fullscreenLoading: false,
                    prevText: "上一页",
                    nextText: "下一页",
                    buttonSize: "small",

                    filterJson: [
                        {
                            "type": "input",
                            "label": "代码",
                            "prop": "Code",
                            "default": ""
                        },
                        {
                            "type": "input",
                            "label": "名称",
                            "prop": "Name",
                            "default": ""
                        },
                        {
                            "type": "select",
                            "label": "状态",
                            "prop": "IsDisable",
                            "default": null,
                            "options": [
                                { "label": "启动", "value": 0 },
                                { "label": "禁用", "value": 1 },
                            ]
                        }
                    ],

                    tableData: [],
                    columns: [],

                    dialogVisible: false,
                    footerVisible: false,
                    dialogWidth: "40%",

                    loading: false,
                    formData: {},
                    primaryKey: 'id',
                    formJson: [
                        {
                            type: 'input',
                            label: '代码',
                            prop: 'code',
                            default: '',
                            rules: [{ required: true, message: '不能为空', trigger: 'blur' }]
                        },
                        {
                            type: 'input',
                            label: '名称',
                            prop: 'name',
                            default: '',
                            rules: [{ required: true, message: '不能为空', trigger: 'blur' }]
                        },
                        {
                            type: 'select',
                            label: '默认项目',
                            prop: 'isDefault',
                            default: 0,
                            options: [
                                { label: '非默认', value: 0 },
                                { label: '默认', value: 1 },
                            ],
                            rules: [{ required: true, message: '不能为空' }]
                        },
                        {
                            type: 'select',
                            label: '状态',
                            prop: 'isDisable',
                            default: 0,
                            options: [
                                { label: '启用', value: 0 },
                                { label: '禁用', value: 1 },
                            ],
                            rules: [{ required: true, message: '不能为空' }]
                        },
                        {
                            type: 'number',
                            label: '排序',
                            prop: 'sort',
                            min: 1,
                            max: 10000,
                            step: 10,
                            placeholder: '不能为空',
                            default: 10,
                            rules: [{ required: true, message: '不能为空', trigger: 'blur' },
                            { type: 'number', message: '数量必须为数字', trigger: 'blur' }]
                        },
                        {
                            type: "textarea",
                            label: "备注",
                            prop: "remark",
                            default: ""
                        },
                    ],

                    dictValueDialogVisible: false,
                    dictValueUrl: "",
                    url: "/gantt/index/",
                }
            },
            created() {
                this.handleLoadData();
            },
            mounted: function () { },
            methods: {
                onClose() {
                    this.dictValueDialogVisible = false;
                },
                handleDictValue(e) {
                    this.dictValueUrl = Vue.prototype.$baseURL + this.url + e.key;
                    this.dictValueDialogVisible = true;
                },
                handleLoadData(e) {
                    let curry = e ? e.curry : { pageNo: 1, pageSize: 10 };
                    if (curry == undefined || curry == null) curry = { pageNo: 1, pageSize: 10 };
                    let filter = e ? e.filter : {};
                    var data = { ...curry, ...filter };
                    if (data.IsDisable == "") data.IsDisable = null;
                    if (data.IsDefault == "") data.IsDefault = 0;
                    this.$http.post("/project/pages", data).then((res) => {
                        this.tableData = res.rows;
                        this.totalRows = res.totalRows;
                    });
                },
                handleDelete(e) {
                    this.$http.delete("/project/delete/" + e.key).then((res) => {
                        if (!res) {
                            this.$message({ message: "删除成功", center: true, type: 'success' });
                            this.handleLoadData();
                        }
                    });
                },
                submitForm(data) {
                    this.$http.post("/project/submit", data).then((res) => {
                        if (res) {
                            this.$message({ message: "操作成功", center: true, type: 'success' });
                            this.handleLoadData();
                            this.dialogVisible = false;
                        }
                    });
                },
                viewDetailDialog(e) {
                    this.dialogVisible = true;
                    this.formData = e.row;
                }
            },
            filters: {

            }
        });
    </script>
}